import { Input } from 'antd';
import style from './index.less';
import { LockOutlined } from '@ant-design/icons';
import { Form } from 'antd';
import { Button, message } from 'antd';
import React from 'react';
import request from '@/http';
import { history } from 'umi';
import All_style from '../../index.less';

const layout = {
  labelCol: { span: 0 },
  wrapperCol: { span: 24 },
};
function Modify() {
  const [formObject] = Form.useForm();
  const [captchaUrl, setCaptchaUrl] = React.useState('');
  const doModify = async () => {
    const data = await formObject.validateFields();
    console.log(data);
    const result: any = await request.post('/user/adminUpdatePass', data);
    if (result.code == '200') {
      /*跳转到登录页面并清除token */
      message.success('修改密码成功');
      history.replace('');
    } else {
      message.error(result.message);
    }
  };

  return (
    <div className={style.box}>
      <Form
        {...layout}
        name="ModifyPassword"
        form={formObject}
        preserve={false}
      >
        <Form.Item
          name={'password'}
          rules={[
            { required: true, whitespace: true, message: '密码不能为空' },
            { min: 6, message: '密码最少为6位' },
          ]}
          label="当前密码"
          className={style.formItem}
        >
          <Input.Password
            placeholder={'旧密码'}
            className={style.Input}
          ></Input.Password>
        </Form.Item>
        <Form.Item
          name={'newPassword'}
          rules={[
            { required: true, whitespace: true, message: '密码不能为空' },
            { min: 6, message: '密码最少为6位' },
          ]}
          label="新&nbsp;&nbsp;密&nbsp;&nbsp;码"
          className={style.formItem}
        >
          <Input.Password
            placeholder={'请输入新密码(6~16位)'}
            className={style.Input}
          ></Input.Password>
        </Form.Item>
        <Form.Item
          name={'confirmPassword'}
          rules={[
            { required: true, whitespace: true, message: '密码不能为空' },
            { min: 6, message: '密码最少为6位' },
          ]}
          label="确认密码"
          className={style.formItem}
        >
          <Input.Password
            placeholder={'确认密码'}
            className={style.Input}
          ></Input.Password>
        </Form.Item>

        <Button
          type={'primary'}
          className={All_style.button}
          onClick={doModify}
        >
          确认修改
        </Button>
      </Form>
    </div>
  );
}

export default Modify;
